<!DOCTYPE html>
<html>
  <head>
    <title><%= @title %></title>
    <%= stylesheet_link_tag 'blueprint/screen', :media => 'screen' %>
    <%= stylesheet_link_tag 'blueprint/print',  :media => 'print' %>
      <!--[if lt IE 8]><%= stylesheet_link_tag 'blueprint/ie' %><![endif]-->
    <%= stylesheet_link_tag 'scaffold', :media => 'screen' %>
    <%= javascript_include_tag 'jquery-1.6.1.min.js', 'rails', 'application' %>
    <%= csrf_meta_tag %>



  </head>
  <body>
    <div class="main">
      <br></br>
      <table class="header">
        <tr>
          <td>
            <h1><%=link_to "Blog", root_path  %> </h1>

          </td>

          <td>
            <div>
              <%= render 'shared/mainmenu' %>
            </div>
          </td>
        </tr>
      </table>


      <% flash.each do |key, value| %>
        <div class="notbut"style="background-color: red; position: absolute;
             margin-left: 445px; padding: 5px; text-align: center;">Notices</div>
        <div class="flash">
          <script>;
            $(document).ready(function(){
            $(".alert , .notice").animate({height: "show"}, 300);
            setTimeout( function() {
            $(".alert , .notice").animate({height: "hide"}, 500);
            }, 2000 );
            $(".flash").css( "margin-left",  $(".main").width()/2 - $(".<%= key %>").width()/2 );
            });
            $(".notbut").mouseenter(function() {
            $(".alert , .notice").animate({height: "show"}, 300);
            });
            $(".flash").mouseleave(function() {
            $(".alert , .notice").animate({height: "hide"}, 500);
            });

          </script>


          <div  class="<%= key %>"><%= value %></div>
        </div>

      <% end %>
      <div>
        <%= render 'shared/usermenu' %>
      </div>
      <div class="container">

        <%= yield %>
      </div>
      <div class="footer">
        footer
      </div>
    </div>
  </body>
</html>
